<%@ page contentType="text/html;charset=UTF-8" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
    <meta name="description" content=""/>
    <meta name="author" content=""/>
    <title>管理系统Demo版 - Fobia</title>
    <!-- notifications css -->
    <asset:stylesheet src="fobia/plugins/notifications/css/lobibox.min.css"/>
    <!-- Vector CSS -->
    <asset:stylesheet src="fobia/plugins/vectormap/jquery-jvectormap-2.0.2.css"/>
    <!-- simplebar CSS-->
    <asset:stylesheet src="fobia/plugins/simplebar/css/simplebar.css"/>
    <!-- Bootstrap core CSS-->
    <asset:stylesheet src="fobia/css/bootstrap.min.css"/>
    <!-- animate CSS-->
    <asset:stylesheet src="fobia/css/animate.css"/>
    <!-- Icons CSS-->
    <asset:stylesheet src="fobia/css/icons.css"/>
    <!-- Sidebar CSS-->
    <asset:stylesheet src="fobia/css/sidebar-menu.css"/>
    <!-- Custom Style-->
    <asset:stylesheet src="fobia/css/app-style.css"/>


</head>
<body onload="info_noti()">

<!-- Start wrapper-->
<div id="wrapper">

    <!--Start sidebar-wrapper-->
    <div id="sidebar-wrapper" data-simplebar="" data-simplebar-auto-hide="true">
        <div class="brand-logo">
            <a href="index.html">
                <img src="assets/images/logo-icon.png" class="logo-icon" alt="logo icon">
                <h5 class="logo-text">Fobia Admin</h5>
            </a>
        </div>
        <div class="user-details">
            <div class="media align-items-center user-pointer collapsed" data-toggle="collapse" data-target="#user-dropdown">
                <div class="avatar"><img class="mr-3 side-user-img" src="assets/images/avatars/avatar-4.png" alt="user avatar"></div>
                <div class="media-body">
                    <h6 class="side-user-name">Mark Jhonsan</h6>
                </div>
            </div>
            <div id="user-dropdown" class="collapse">
                <ul class="user-setting-menu">
                    <li><a href="javaScript:void();"><i class="icon-user"></i>  My Profile</a></li>
                    <li><a href="javaScript:void();"><i class="icon-settings"></i> Setting</a></li>
                    <li><a href="javaScript:void();"><i class="icon-power"></i> Logout</a></li>
                </ul>
            </div>
        </div>
        <ul class="sidebar-menu do-nicescrol">
            <li class="sidebar-header">MAIN NAVIGATION</li>
            <li>
                <a href="index.html" class="waves-effect">
                    <i class="icon-home"></i><span>Dashboard</span><i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="index.html"><i class="fa fa-long-arrow-right"></i> Dashboard v1</a></li>
                    <li><a href="index2.html"><i class="fa fa-long-arrow-right"></i> Dashboard v2</a></li>
                    <li><a href="index3.html"><i class="fa fa-long-arrow-right"></i> Dashboard v3</a></li>
                </ul>
            </li>
            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-handbag"></i><span>UI Elements</span>
                    <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="ui-typography.html"><i class="fa fa-long-arrow-right"></i> Typography</a></li>
                    <li><a href="ui-buttons.html"><i class="fa fa-long-arrow-right"></i> Buttons</a></li>
                    <li><a href="ui-cards.html"><i class="fa fa-long-arrow-right"></i> Cards</a></li>
                    <li><a href="ui-checkbox-radio.html"><i class="fa fa-long-arrow-right"></i> Checkboxes & Radios</a></li>
                    <li><a href="ui-tabs-accordions.html"><i class="fa fa-long-arrow-right"></i> Tabs & Accordions</a></li>
                    <li><a href="ui-modals.html"><i class="fa fa-long-arrow-right"></i> Modals</a></li>
                    <li><a href="ui-bootstrap-elements.html"><i class="fa fa-long-arrow-right"></i> BS Elements</a></li>
                    <li><a href="ui-pagination.html"><i class="fa fa-long-arrow-right"></i> Pagination</a></li>
                    <li><a href="ui-list-groups.html"><i class="fa fa-long-arrow-right"></i> List Groups</a></li>
                    <li><a href="ui-alerts.html"><i class="fa fa-long-arrow-right"></i> Alerts</a></li>
                    <li><a href="ui-progressbars.html"><i class="fa fa-long-arrow-right"></i> Progress Bars</a></li>
                    <li><a href="ui-notification.html"><i class="fa fa-long-arrow-right"></i> Notifications</a></li>
                    <li><a href="ui-sweet-alert.html"><i class="fa fa-long-arrow-right"></i> Sweet Alerts</a></li>
                    <li><a href="ui-color-palette.html"><i class="fa fa-long-arrow-right"></i> Color Palette</a></li>
                    <li><a href="ui-lightbox-gallery.html"><i class="fa fa-long-arrow-right"></i> Lightbox gallery</a></li>
                </ul>
            </li>

            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-diamond"></i><span>Components</span>
                    <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="components-grid-layouts.html"><i class="fa fa-long-arrow-right"></i> Grid Layouts</a></li>
                    <li><a href="components-nestable.html"><i class="fa fa-long-arrow-right"></i> Nesteble</a></li>
                    <li><a href="components-tree-view-menu.html"><i class="fa fa-long-arrow-right"></i> Tree View</a></li>
                    <li><a href="components-switcher-buttons.html"><i class="fa fa-long-arrow-right"></i> Switcher Buttons</a></li>
                    <li><a href="components-range-slider.html"><i class="fa fa-long-arrow-right"></i> Range Sliders</a></li>
                    <li><a href="components-vertical-timeline.html"><i class="fa fa-long-arrow-right"></i> Vertical Timeline</a></li>
                    <li><a href="components-horizontal-timeline.html"><i class="fa fa-long-arrow-right"></i> Horizontal Timeline</a></li>
                    <li><a href="components-pricing-table.html"><i class="fa fa-long-arrow-right"></i> Pricing Tables</a></li>
                    <li><a href="components-image-carousel.html"><i class="fa fa-long-arrow-right"></i> Image Carousels</a></li>
                </ul>
            </li>
            <li>
                <a href="widgets.html" class="waves-effect"><i class="icon-cup"></i><span>Widgets</span>
                    <small class="badge float-right badge-danger">New</small>
                </a>
            </li>
            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-lock-open"></i><span>Authentication</span>
                    <i class="fa fa-angle-left float-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="authentication-signin.html" target="_blank"><i class="fa fa-long-arrow-right"></i> SignIn 1</a></li>
                    <li><a href="authentication-signin2.html" target="_blank"><i class="fa fa-long-arrow-right"></i> SignIn 2</a></li>
                    <li><a href="authentication-signup.html" target="_blank"><i class="fa fa-long-arrow-right"></i> SignUp 1</a></li>
                    <li><a href="authentication-signup2.html" target="_blank"><i class="fa fa-long-arrow-right"></i> SignUp 2</a></li>
                    <li><a href="authentication-reset-password.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Reset Password 1</a></li>
                    <li><a href="authentication-reset-password2.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Reset Password 2</a></li>
                    <li class="sidebar-header text-info">DARK AUTHENTICATION</li>
                    <li><a href="authentication-dark-signin.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Dark SignIn 1</a></li>
                    <li><a href="authentication-dark-signin2.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Dark SignIn 2</a></li>
                    <li><a href="authentication-dark-signup.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Dark SignUp 1</a></li>
                    <li><a href="authentication-dark-signup2.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Dark SignUp 2</a></li>
                    <li><a href="authentication-dark-reset-password.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Dark Reset Password 1</a></li>
                    <li><a href="authentication-dark-reset-password2.html" target="_blank"><i class="fa fa-long-arrow-right"></i> Dark Reset Password 2</a></li>
                </ul>
            </li>
            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-pie-chart"></i><span>Charts</span>
                    <i class="fa fa-angle-left float-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="charts-morris.html"><i class="fa fa-long-arrow-right"></i> Morris Charts</a></li>
                    <li><a href="charts-chartjs.html"><i class="fa fa-long-arrow-right"></i> Chart JS</a></li>
                    <li><a href="charts-c3-charts.html"><i class="fa fa-long-arrow-right"></i> C3 Chart</a></li>
                    <li><a href="charts-flot.html"><i class="fa fa-long-arrow-right"></i> Flot Chart</a></li>
                    <li><a href="charts-peity.html"><i class="fa fa-long-arrow-right"></i> Peity Charts</a></li>
                    <li><a href="charts-sparkline.html"><i class="fa fa-long-arrow-right"></i> Sparkline Charts</a></li>
                    <li><a href="charts-other.html"><i class="fa fa-long-arrow-right"></i> Other Charts</a></li>
                </ul>
            </li>
            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-note"></i><span>Forms</span>
                    <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="form-inputs.html"><i class="fa fa-long-arrow-right"></i> Basic Inputs</a></li>
                    <li><a href="form-input-group.html"><i class="fa fa-long-arrow-right"></i> Input Groups</a></li>
                    <li><a href="form-layouts.html"><i class="fa fa-long-arrow-right"></i> Form Layouts</a></li>
                    <li><a href="form-color-forms.html"><i class="fa fa-long-arrow-right"></i> Color Forms</a></li>
                    <li><a href="form-gradients-forms.html"><i class="fa fa-long-arrow-right"></i> Gradient Forms</a></li>
                    <li><a href="form-advanced.html"><i class="fa fa-long-arrow-right"></i> Form Advanced</a></li>
                    <li><a href="form-validation.html"><i class="fa fa-long-arrow-right"></i> Form Validation</a></li>
                    <li><a href="form-step-wizard.html"><i class="fa fa-long-arrow-right"></i> Form Wizard</a></li>
                    <li><a href="form-text-editor.html"><i class="fa fa-long-arrow-right"></i> Form Editor</a></li>
                    <li><a href="form-uploads.html"><i class="fa fa-long-arrow-right"></i> Form Uploads</a></li>
                </ul>
            </li>

            <li>
                <a href="calendar.html" class="waves-effect">
                    <i class="icon-calendar"></i><span>Calendar</span>
                    <small class="badge float-right badge-info">New</small>
                </a>
            </li>
            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-grid"></i><span>Tables</span>
                    <i class="fa fa-angle-left float-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="table-simple-tables.html"><i class="fa fa-long-arrow-right"></i> Simple Tables</a></li>
                    <li><a href="table-header-tables.html"><i class="fa fa-long-arrow-right"></i> Header Tables</a></li>
                    <li><a href="table-color-tables.html"><i class="fa fa-long-arrow-right"></i> Color Tables</a></li>
                    <li><a href="table-striped-color-tables.html"><i class="fa fa-long-arrow-right"></i> Striped Color Tables</a></li>
                    <li><a href="table-data-tables.html"><i class="fa fa-long-arrow-right"></i> Data Tables</a></li>
                </ul>
            </li>
            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-magnet"></i><span>UI Icons</span>
                    <i class="fa fa-angle-left float-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="icons-material-designs.html"><i class="fa fa-long-arrow-right"></i> Material Design</a></li>
                    <li><a href="icons-font-awesome.html"><i class="fa fa-long-arrow-right"></i> Font Awesome</a></li>
                    <li><a href="icons-themify.html"><i class="fa fa-long-arrow-right"></i> Themify Icons</a></li>
                    <li><a href="icons-simple-line-icons.html"><i class="fa fa-long-arrow-right"></i> Line Icons</a></li>
                    <li><a href="icons-flags.html"><i class="fa fa-long-arrow-right"></i> Flag Icons</a></li>
                </ul>
            </li>
            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-envelope-letter"></i><span>Mailbox</span>
                    <small class="badge float-right badge-warning">12</small>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="mail-inbox.html"><i class="fa fa-long-arrow-right"></i> Inbox</a></li>
                    <li><a href="mail-compose.html"><i class="fa fa-long-arrow-right"></i> Compose</a></li>
                    <li><a href="mail-read.html"><i class="fa fa-long-arrow-right"></i> Read Mail</a></li>
                </ul>
            </li>

            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-map"></i><span>Maps</span>
                    <i class="fa fa-angle-left float-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="maps-google.html"><i class="fa fa-long-arrow-right"></i> Google Maps</a></li>
                    <li><a href="maps-vector.html"><i class="fa fa-long-arrow-right"></i> Vector Maps</a></li>
                </ul>
            </li>

            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-folder-alt"></i><span>Extra Pages</span>
                    <i class="fa fa-angle-left float-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="pages-invoice.html"><i class="fa fa-long-arrow-right"></i> Invoice</a></li>
                    <li><a href="pages-user-profile.html"><i class="fa fa-long-arrow-right"></i> User Profile</a></li>
                    <li><a href="pages-lock-screen.html"><i class="fa fa-long-arrow-right"></i> Lockscreen</a></li>
                    <li><a href="pages-blank-page.html"><i class="fa fa-long-arrow-right"></i> Blank Page</a></li>
                    <li><a href="pages-coming-soon.html"><i class="fa fa-long-arrow-right"></i> Coming Soon</a></li>
                    <li><a href="pages-403.html"><i class="fa fa-long-arrow-right"></i> 403 Error</a></li>
                    <li><a href="pages-404.html"><i class="fa fa-long-arrow-right"></i> 404 Error</a></li>
                    <li><a href="pages-500.html"><i class="fa fa-long-arrow-right"></i> 500 Error</a></li>
                </ul>
            </li>

            <li>
                <a href="javaScript:void();" class="waves-effect">
                    <i class="icon-share"></i><span>Multilevel</span>
                    <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="sidebar-submenu">
                    <li><a href="javaScript:void();"><i class="fa fa-long-arrow-right"></i> Level One</a></li>
                    <li>
                        <a href="javaScript:void();"><i class="fa fa-long-arrow-right"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
                        <ul class="sidebar-submenu">
                            <li><a href="javaScript:void();"><i class="fa fa-long-arrow-right"></i> Level Two</a></li>
                            <li>
                                <a href="javaScript:void();"><i class="fa fa-long-arrow-right"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
                                <ul class="sidebar-submenu">
                                    <li><a href="javaScript:void();"><i class="fa fa-long-arrow-right"></i> Level Three</a></li>
                                    <li><a href="javaScript:void();"><i class="fa fa-long-arrow-right"></i> Level Three</a></li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                    <li><a href="javaScript:void();" class="waves-effect"><i class="fa fa-long-arrow-right"></i> Level One</a></li>
                </ul>
            </li>
            <li class="sidebar-header">LABELS</li>
            <li><a href="javaScript:void();" class="waves-effect"><i class="icon-cloud-upload text-danger"></i><span>Disk Space</span></a></li>
            <li><a href="javaScript:void();" class="waves-effect"><i class="icon-hourglass text-warning"></i><span>Server Load</span></a></li>
            <li><a href="javaScript:void();" class="waves-effect"><i class="icon-drop text-info"></i><span>Information</span></a></li>
        </ul>

    </div>
    <!--End sidebar-wrapper-->

    <!--Start topbar header-->
    <header class="topbar-nav">
        <nav class="navbar navbar-expand fixed-top bg-white">
            <ul class="navbar-nav mr-auto align-items-center">
                <li class="nav-item">
                    <a class="nav-link toggle-menu" href="javascript:void();">
                        <i class="icon-menu menu-icon"></i>
                    </a>
                </li>
                <li class="nav-item">
                    <form class="search-bar">
                        <input type="text" class="form-control" placeholder="Enter keywords">
                        <a href="javascript:void();"><i class="icon-magnifier"></i></a>
                    </form>
                </li>
            </ul>

            <ul class="navbar-nav align-items-center right-nav-link">
                <li class="nav-item dropdown-lg">
                    <a class="nav-link dropdown-toggle dropdown-toggle-nocaret waves-effect" data-toggle="dropdown" href="javascript:void();">
                        <i class="icon-envelope-open"></i></a>
                    <div class="dropdown-menu dropdown-menu-right animated fadeIn">
                        <ul class="list-group list-group-flush">
                            <li class="list-group-item d-flex justify-content-between align-items-center">
                                You have 4 new messages
                                <span class="badge badge-danger">4</span>
                            </li>
                            <li class="list-group-item">
                                <a href="javaScript:void();">
                                    <div class="media">
                                        <div class="avatar"><img class="align-self-start mr-3" src="assets/images/avatars/avatar-1.png" alt="user avatar"></div>
                                        <div class="media-body">
                                            <h6 class="mt-0 msg-title">Jhon Deo</h6>
                                            <p class="msg-info">Lorem ipsum dolor sit amet...</p>
                                            <small>Today, 4:10 PM</small>
                                        </div>
                                    </div>
                                </a>
                            </li>
                            <li class="list-group-item">
                                <a href="javaScript:void();">
                                    <div class="media">
                                        <div class="avatar"><img class="align-self-start mr-3" src="assets/images/avatars/avatar-2.png" alt="user avatar"></div>
                                        <div class="media-body">
                                            <h6 class="mt-0 msg-title">Sara Jen</h6>
                                            <p class="msg-info">Lorem ipsum dolor sit amet...</p>
                                            <small>Yesterday, 8:30 AM</small>
                                        </div>
                                    </div>
                                </a>
                            </li>
                            <li class="list-group-item">
                                <a href="javaScript:void();">
                                    <div class="media">
                                        <div class="avatar"><img class="align-self-start mr-3" src="assets/images/avatars/avatar-3.png" alt="user avatar"></div>
                                        <div class="media-body">
                                            <h6 class="mt-0 msg-title">Dannish Josh</h6>
                                            <p class="msg-info">Lorem ipsum dolor sit amet...</p>
                                            <small>5/11/2018, 2:50 PM</small>
                                        </div>
                                    </div>
                                </a>
                            </li>
                            <li class="list-group-item">
                                <a href="javaScript:void();">
                                    <div class="media">
                                        <div class="avatar"><img class="align-self-start mr-3" src="assets/images/avatars/avatar-4.png" alt="user avatar"></div>
                                        <div class="media-body">
                                            <h6 class="mt-0 msg-title">Katrina Mccoy</h6>
                                            <p class="msg-info">Lorem ipsum dolor sit amet.</p>
                                            <small>1/11/2018, 2:50 PM</small>
                                        </div>
                                    </div>
                                </a>
                            </li>
                            <li class="list-group-item"><a href="javaScript:void();">See All Messages</a></li>
                        </ul>
                    </div>
                </li>
                <li class="nav-item dropdown-lg">
                    <a class="nav-link dropdown-toggle dropdown-toggle-nocaret waves-effect" data-toggle="dropdown" href="javascript:void();">
                        <i class="icon-bell"></i><span class="badge badge-primary badge-up">10</span></a>
                    <div class="dropdown-menu dropdown-menu-right animated fadeIn">
                        <ul class="list-group list-group-flush">
                            <li class="list-group-item d-flex justify-content-between align-items-center">
                                You have 10 Notifications
                                <span class="badge badge-primary">10</span>
                            </li>
                            <li class="list-group-item">
                                <a href="javaScript:void();">
                                    <div class="media">
                                        <i class="icon-people fa-2x mr-3 text-info"></i>
                                        <div class="media-body">
                                            <h6 class="mt-0 msg-title">New Registered Users</h6>
                                            <p class="msg-info">Lorem ipsum dolor sit amet...</p>
                                        </div>
                                    </div>
                                </a>
                            </li>
                            <li class="list-group-item">
                                <a href="javaScript:void();">
                                    <div class="media">
                                        <i class="icon-cup fa-2x mr-3 text-warning"></i>
                                        <div class="media-body">
                                            <h6 class="mt-0 msg-title">New Received Orders</h6>
                                            <p class="msg-info">Lorem ipsum dolor sit amet...</p>
                                        </div>
                                    </div>
                                </a>
                            </li>
                            <li class="list-group-item">
                                <a href="javaScript:void();">
                                    <div class="media">
                                        <i class="icon-bell fa-2x mr-3 text-danger"></i>
                                        <div class="media-body">
                                            <h6 class="mt-0 msg-title">New Updates</h6>
                                            <p class="msg-info">Lorem ipsum dolor sit amet...</p>
                                        </div>
                                    </div>
                                </a>
                            </li>
                            <li class="list-group-item"><a href="javaScript:void();">See All Notifications</a></li>
                        </ul>
                    </div>
                </li>
                <li class="nav-item language">
                    <a class="nav-link dropdown-toggle dropdown-toggle-nocaret waves-effect" data-toggle="dropdown" href="#"><i class="flag-icon flag-icon-gb"></i></a>
                    <ul class="dropdown-menu dropdown-menu-right animated fadeIn">
                        <li class="dropdown-item"> <i class="flag-icon flag-icon-gb mr-2"></i> English</li>
                        <li class="dropdown-item"> <i class="flag-icon flag-icon-fr mr-2"></i> French</li>
                        <li class="dropdown-item"> <i class="flag-icon flag-icon-cn mr-2"></i> Chinese</li>
                        <li class="dropdown-item"> <i class="flag-icon flag-icon-de mr-2"></i> German</li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a class="nav-link dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown" href="#">
                        <span class="user-profile"><img src="assets/images/avatars/avatar-17.png" class="img-circle" alt="user avatar"></span>
                    </a>
                    <ul class="dropdown-menu dropdown-menu-right animated fadeIn">
                        <li class="dropdown-item user-details">
                            <a href="javaScript:void();">
                                <div class="media">
                                    <div class="avatar"><img class="align-self-start mr-3" src="assets/images/avatars/avatar-17.png" alt="user avatar"></div>
                                    <div class="media-body">
                                        <h6 class="mt-2 user-title">Katrina Mccoy</h6>
                                        <p class="user-subtitle">katrina92@example.com</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="dropdown-divider"></li>
                        <li class="dropdown-item"><i class="icon-envelope mr-2"></i> Inbox</li>
                        <li class="dropdown-divider"></li>
                        <li class="dropdown-item"><i class="icon-wallet mr-2"></i> Account</li>
                        <li class="dropdown-divider"></li>
                        <li class="dropdown-item"><i class="icon-settings mr-2"></i> Setting</li>
                        <li class="dropdown-divider"></li>
                        <li class="dropdown-item"><i class="icon-power mr-2"></i> Logout</li>
                    </ul>
                </li>
            </ul>
        </nav>
    </header>
    <!--End topbar header-->

    <div class="clearfix"></div>

    <div class="content-wrapper">
        <div class="container-fluid">

            <!--Start Dashboard Content-->

            <div class="row mt-4">
                <div class="col-12 col-lg-6 col-xl-3">
                    <div class="card gradient-purpink">
                        <div class="card-body">
                            <div class="media">
                                <div class="media-body text-left">
                                    <h4 class="text-white">$4530</h4>
                                    <span class="text-white">Revenue</span>
                                </div>
                                <div class="align-self-center"><span id="dash-chart-1"></span></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-lg-6 col-xl-3">
                    <div class="card gradient-scooter">
                        <div class="card-body">
                            <div class="media">
                                <div class="media-body text-left">
                                    <h4 class="text-white">2500</h4>
                                    <span class="text-white">Total Orders</span>
                                </div>
                                <div class="align-self-center"><span id="dash-chart-2"></span></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-lg-6 col-xl-3">
                    <div class="card gradient-ibiza">
                        <div class="card-body">
                            <div class="media">
                                <div class="media-body text-left">
                                    <h4 class="text-white">7850</h4>
                                    <span class="text-white">Comments</span>
                                </div>
                                <div class="align-self-center"><span id="dash-chart-3"></span></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-lg-6 col-xl-3">
                    <div class="card gradient-ohhappiness">
                        <div class="card-body">
                            <div class="media">
                                <div class="media-body text-left">
                                    <h4 class="text-white">3524</h4>
                                    <span class="text-white">Total Views</span>
                                </div>
                                <div class="align-self-center"><span id="dash-chart-4"></span></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!--End Row-->

            <div class="row">
                <div class="col-12 col-lg-12 col-xl-12">
                    <div class="card">
                        <div class="card-header">
                            Product Sales
                            <div class="card-action">
                                <div class="dropdown">
                                    <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                        <i class="icon-options"></i>
                                    </a>
                                    <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                        <a class="dropdown-item" href="javascript:void();">Action</a>
                                        <a class="dropdown-item" href="javascript:void();">Another action</a>
                                        <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                        <div class="dropdown-divider"></div>
                                        <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-body">
                            <canvas id="dash-chart-5" height="100"></canvas>
                            <div class="row">
                                <div class="col-12">
                                    <div class="card bg-transparent shadow-none mb-0">
                                        <div class="card-content">
                                            <div class="row row-group m-0">
                                                <div class="col-12 col-lg-6 col-xl-3">
                                                    <div class="card-body text-center">
                                                        <h3 class="text-danger">$157</h3>
                                                        <span>Today's Sales</span>
                                                    </div>
                                                </div>
                                                <div class="col-12 col-lg-6 col-xl-3">
                                                    <div class="card-body text-center">
                                                        <h3 class="text-warning">$1423</h3>
                                                        <span>This Week Sales</span>
                                                    </div>
                                                </div>
                                                <div class="col-12 col-lg-6 col-xl-3">
                                                    <div class="card-body text-center">
                                                        <h3 class="text-success">$6500</h3>
                                                        <span>This Month Sales</span>
                                                    </div>
                                                </div>
                                                <div class="col-12 col-lg-6 col-xl-3">
                                                    <div class="card-body text-center">
                                                        <h3 class="text-info">$45,624</h3>
                                                        <span>This Year Sales</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div><!--End Row-->
                        </div>
                    </div>
                </div>
            </div><!--End Row-->

            <div class="row">
                <div class="col-12 col-lg-6 col-xl-6">
                    <div class="card">
                        <div class="card-header">
                            Top Selling Categories
                            <div class="card-action">
                                <div class="dropdown">
                                    <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                        <i class="icon-options"></i>
                                    </a>
                                    <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                        <a class="dropdown-item" href="javascript:void();">Action</a>
                                        <a class="dropdown-item" href="javascript:void();">Another action</a>
                                        <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                        <div class="dropdown-divider"></div>
                                        <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-body">
                            <canvas id="dash-chart-6"></canvas>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-lg-6 col-xl-6">
                    <div class="card">
                        <div class="card-header">
                            Product Views
                            <div class="card-action">
                                <div class="dropdown">
                                    <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                        <i class="icon-options"></i>
                                    </a>
                                    <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                        <a class="dropdown-item" href="javascript:void();">Action</a>
                                        <a class="dropdown-item" href="javascript:void();">Another action</a>
                                        <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                        <div class="dropdown-divider"></div>
                                        <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-body">
                            <canvas id="dash-chart-7"></canvas>
                        </div>
                    </div>
                </div>
            </div><!--End Row-->

            <div class="card">
                <div class="card-header">Web Site Performance
                    <div class="card-action">
                        <div class="dropdown">
                            <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                <i class="icon-options"></i>
                            </a>
                            <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                <a class="dropdown-item" href="javascript:void();">Action</a>
                                <a class="dropdown-item" href="javascript:void();">Another action</a>
                                <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                <div class="dropdown-divider"></div>
                                <a class="dropdown-item" href="javascript:void();">Separated link</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <div class="row text-center row-group m-0">
                        <div class="col-12 col-lg-6 col-xl-3">
                            <input class="knob" data-width="120" data-height="120" data-readOnly="true" data-thickness=".2" data-angleoffset="90" data-linecap="round" data-bgcolor="rgba(0, 0, 0, 0.08)" data-fgcolor="#008cff" data-max="15000" value="8550"/>
                            <hr>
                            <p class="mb-0 small-font text-center">2.4% <i class="zmdi zmdi-long-arrow-up"></i> Total Clicks</p>
                        </div>
                        <div class="col-12 col-lg-6 col-xl-3">
                            <input class="knob" data-width="120" data-height="120" data-readOnly="true" data-thickness=".2" data-angleoffset="90" data-linecap="round" data-bgcolor="rgba(0, 0, 0, 0.08)" data-fgcolor="#fd3550" data-max="15000" value="12000"/>
                            <hr>
                            <p class="mb-0 small-font text-center">3.6% <i class="zmdi zmdi-long-arrow-up"></i> Page Likes</p>
                        </div>
                        <div class="col-12 col-lg-6 col-xl-3">
                            <input class="knob" data-width="120" data-height="120" data-readOnly="true" data-thickness=".2" data-angleoffset="90" data-linecap="round" data-bgcolor="rgba(0, 0, 0, 0.08)" data-fgcolor="#15ca20" data-max="15000" value="7652"/>
                            <hr>
                            <p class="mb-0 small-font text-center">5.8% <i class="zmdi zmdi-long-arrow-up"></i> New Visitors</p>
                        </div>
                        <div class="col-12 col-lg-6 col-xl-3">
                            <input class="knob" data-width="120" data-height="120" data-readOnly="true" data-thickness=".2" data-angleoffset="90" data-linecap="round" data-bgcolor="rgba(0, 0, 0, 0.08)" data-fgcolor="#0dceec" data-max="15000" value="9550"/>
                            <hr>
                            <p class="mb-0 small-font text-center">4.1% <i class="zmdi zmdi-long-arrow-up"></i> Server Load</p>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-header border-0">
                            Recent Orders
                            <div class="card-action">
                                <div class="dropdown">
                                    <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                        <i class="icon-options"></i>
                                    </a>
                                    <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                        <a class="dropdown-item" href="javascript:void();">Action</a>
                                        <a class="dropdown-item" href="javascript:void();">Another action</a>
                                        <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                        <div class="dropdown-divider"></div>
                                        <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="table-responsive">
                            <table class="table align-items-center table-flush">
                                <thead>
                                <tr>
                                    <th>Photo</th>
                                    <th>Product</th>
                                    <th>Amount</th>
                                    <th>Status</th>
                                    <th>Completion</th>
                                    <th>Date</th>
                                </tr>
                                </thead>
                                <tr>
                                    <td>
                                        <img alt="Image placeholder" src="assets/images/products/1.png" class="product-img" alt="product img">
                                    </td>
                                    <td>Headphone GL</td>
                                    <td>$1,840 USD</td>
                                    <td>
                                        <span class="badge-dot">
                                            <i class="bg-danger"></i> pending
                                        </span>
                                    </td>
                                    <td>
                                        <div class="progress shadow" style="height: 4px;">
                                            <div class="progress-bar gradient-ibiza" role="progressbar" style="width: 60%"></div>
                                        </div>
                                    </td>
                                    <td>10 July 2018</td>
                                </tr>
                                <tr>
                                    <td>
                                        <img alt="Image placeholder" src="assets/images/products/2.png" class="product-img" alt="product img">
                                    </td>
                                    <td>Clasic Shoes</td>
                                    <td>$1,520 USD</td>
                                    <td>
                                        <span class="badge-dot">
                                            <i class="bg-success"></i> completed
                                        </span>
                                    </td>
                                    <td>
                                        <div class="progress shadow" style="height: 4px;">
                                            <div class="progress-bar gradient-ohhappiness" role="progressbar" style="width: 100%"></div>
                                        </div>
                                    </td>
                                    <td>12 July 2018</td>
                                </tr>
                                <tr>
                                    <td>
                                        <img alt="Image placeholder" src="assets/images/products/3.png" class="product-img" alt="product img">
                                    </td>
                                    <td>Hand Watch</td>
                                    <td>$1,620 USD</td>
                                    <td>
                                        <span class="badge-dot">
                                            <i class="bg-warning"></i> delayed
                                        </span>
                                    </td>
                                    <td>
                                        <div class="progress shadow" style="height: 4px;">
                                            <div class="progress-bar gradient-orange" role="progressbar" style="width: 70%"></div>
                                        </div>
                                    </td>
                                    <td>14 July 2018</td>
                                </tr>
                                <tr>
                                    <td>
                                        <img alt="Image placeholder" src="assets/images/products/4.png" class="product-img" alt="product img">
                                    </td>
                                    <td>Hand Camera</td>
                                    <td>$2,220 USD</td>
                                    <td>
                                        <span class="badge-dot">
                                            <i class="bg-info"></i> on schedule
                                        </span>
                                    </td>
                                    <td>
                                        <div class="progress shadow" style="height: 4px;">
                                            <div class="progress-bar gradient-scooter" role="progressbar" style="width: 85%"></div>
                                        </div>
                                    </td>
                                    <td>16 July 2018</td>
                                </tr>
                                <tr>
                                    <td>
                                        <img alt="Image placeholder" src="assets/images/products/5.png" class="product-img" alt="product img">
                                    </td>
                                    <td>Iphone-X Pro</td>
                                    <td>$9,890 USD</td>
                                    <td>
                                        <span class="badge-dot">
                                            <i class="bg-success"></i> completed
                                        </span>
                                    </td>
                                    <td>
                                        <div class="progress shadow" style="height: 4px;">
                                            <div class="progress-bar gradient-ohhappiness" role="progressbar" style="width: 100%"></div>
                                        </div>
                                    </td>
                                    <td>17 July 2018</td>
                                </tr>
                                <tr>
                                    <td>
                                        <img alt="Image placeholder" src="assets/images/products/6.png" class="product-img" alt="product img">
                                    </td>
                                    <td>Ladies Purse</td>
                                    <td>$3,420 USD</td>
                                    <td>
                                        <span class="badge-dot">
                                            <i class="bg-danger"></i> pending
                                        </span>
                                    </td>
                                    <td>
                                        <div class="progress shadow" style="height: 4px;">
                                            <div class="progress-bar gradient-ibiza" role="progressbar" style="width: 80%"></div>
                                        </div>
                                    </td>
                                    <td>18 July 2018</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
            </div><!--End Row-->

            <div class="row">
                <div class="col-12 col-lg-6 col-xl-6">
                    <div class="card">
                        <div class="card-header">Top Selling Country
                            <div class="card-action">
                                <div class="dropdown">
                                    <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                        <i class="icon-options"></i>
                                    </a>
                                    <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                        <a class="dropdown-item" href="javascript:void();">Action</a>
                                        <a class="dropdown-item" href="javascript:void();">Another action</a>
                                        <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                        <div class="dropdown-divider"></div>
                                        <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-body">

                            <div id="dashboard-map" style="height: 210px"></div>

                            <p><i class="flag-icon flag-icon-us mr-1"></i> USA <span class="float-right">50%</span></p>
                            <div class="progress" style="height: 5px;">
                                <div class="progress-bar gradient-royal" role="progressbar" style="width: 50%"></div>
                            </div>

                            <p class="mt-3"><i class="flag-icon flag-icon-ca mr-1"></i> Canada <span class="float-right">65%</span></p>
                            <div class="progress" style="height: 5px;">
                                <div class="progress-bar gradient-ibiza" role="progressbar" style="width: 65%"></div>
                            </div>

                            <p class="mt-3"><i class="flag-icon flag-icon-gb mr-1"></i> England <span class="float-right">85%</span></p>
                            <div class="progress" style="height: 5px;">
                                <div class="progress-bar gradient-meridian" role="progressbar" style="width: 85%"></div>
                            </div>

                            <p class="mt-3"><i class="flag-icon flag-icon-au mr-1"></i> Australia <span class="float-right">75%</span></p>
                            <div class="progress" style="height: 5px;">
                                <div class="progress-bar gradient-orange" role="progressbar" style="width: 75%"></div>
                            </div>

                            <p class="mt-3"><i class="flag-icon flag-icon-in mr-1"></i> India <span class="float-right">45%</span></p>
                            <div class="progress" style="height: 5px;">
                                <div class="progress-bar gradient-violet" role="progressbar" style="width: 55%"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-12 col-lg-6 col-xl-6">

                    <div class="card">
                        <div class="card-header border-0">Traffic Resources
                            <div class="card-action">
                                <div class="dropdown">
                                    <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                        <i class="icon-options"></i>
                                    </a>
                                    <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                        <a class="dropdown-item" href="javascript:void();">Action</a>
                                        <a class="dropdown-item" href="javascript:void();">Another action</a>
                                        <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                        <div class="dropdown-divider"></div>
                                        <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="table-responsive">
                            <table class="table align-items-center table-flush">
                                <thead>
                                <tr>
                                    <th>Source</th>
                                    <th>Path</th>
                                    <th>Visits</th>
                                </tr>
                                </thead>
                                <tr>
                                    <td><i class="fa fa-google-plus text-google"></i> Google</td>
                                    <td>google.com</td>
                                    <td>45 <span class="ml-3" id="dash-chart-8"></span></td>
                                </tr>
                                <tr>
                                    <td><i class="fa fa-facebook-square text-facebook"></i> Facebook</td>
                                    <td>facebook.com</td>
                                    <td>56 <span class="ml-3" id="dash-chart-9"></span></td>
                                </tr>
                                <tr>
                                    <td><i class="fa fa-twitter text-twitter"></i> Twitter</td>
                                    <td>twitter.com</td>
                                    <td>42 <span class="ml-3" id="dash-chart-10"></span></td>
                                </tr>
                                <tr>
                                    <td><i class="fa fa-linkedin-square text-linkedin"></i> Linkedin</td>
                                    <td>linkedin.com</td>
                                    <td>52 <span class="ml-3" id="dash-chart-11"></span></td>
                                </tr>
                                <tr>
                                    <td><i class="fa fa-behance text-behance"></i> Behance</td>
                                    <td>behance.com</td>
                                    <td>62 <span class="ml-3" id="dash-chart-12"></span></td>
                                </tr>
                                <tr>
                                    <td><i class="fa fa-dribbble text-dribble"></i> Dribble</td>
                                    <td>dribble.com</td>
                                    <td>72 <span class="ml-3" id="dash-chart-13"></span></td>
                                </tr>
                                <tr>
                                    <td><i class="fa fa-github text-github"></i> Github</td>
                                    <td>github.com</td>
                                    <td>33 <span class="ml-3" id="dash-chart-14"></span></td>
                                </tr>
                            </table>
                        </div>
                    </div>

                    <div class="card gradient-orange">
                        <div class="card-body">
                            <div class="media">
                                <div class="align-self-center"><span id="dash-chart-15"></span></div>
                                <div class="media-body text-right">
                                    <h4 class="text-white">82.56 %</h4>
                                    <span class="text-white">Bounce Rate</span>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div><!--End Row-->

            <div class="card-group">
                <div class="card border-right">
                    <div class="card-header">
                        Sales This Week
                        <div class="card-action">
                            <div class="dropdown">
                                <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                    <i class="icon-options"></i>
                                </a>
                                <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                    <a class="dropdown-item" href="javascript:void();">Action</a>
                                    <a class="dropdown-item" href="javascript:void();">Another action</a>
                                    <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <canvas id="dash-chart-16" height="180"></canvas>
                    </div>
                    <ul class="list-group list-group-flush list shadow-none">
                        <li class="list-group-item d-flex justify-content-between align-items-center">Samsung <span class="badge gradient-purpink text-white badge-pill shadow">50</span></li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">Apple <span class="badge gradient-orange
             text-white badge-pill shadow">50</span></li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">Nokia <span class="badge gradient-meridian text-white badge-pill">50</span></li>
                    </ul>
                </div>
                <div class="card border-right">
                    <div class="card-header">
                        Profit Ratio
                        <div class="card-action">
                            <div class="dropdown">
                                <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                    <i class="icon-options"></i>
                                </a>
                                <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                    <a class="dropdown-item" href="javascript:void();">Action</a>
                                    <a class="dropdown-item" href="javascript:void();">Another action</a>
                                    <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <canvas id="dash-chart-17" height="180"></canvas>
                    </div>
                    <ul class="list-group list-group-flush list shadow-none">
                        <li class="list-group-item d-flex justify-content-between align-items-center">Gross Profit <span class="badge gradient-quepal text-white badge-pill shadow">05</span></li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">Revenue <span class="badge gradient-violet
             text-white badge-pill shadow">08</span></li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">Expense <span class="badge gradient-ibiza text-white badge-pill shadow">07</span></li>
                    </ul>
                </div>
                <div class="card">
                    <div class="card-header">
                        Trending Products
                        <div class="card-action">
                            <div class="dropdown">
                                <a href="javascript:void();" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">
                                    <i class="icon-options"></i>
                                </a>
                                <div class="dropdown-menu animated fadeIn dropdown-menu-right">
                                    <a class="dropdown-item" href="javascript:void();">Action</a>
                                    <a class="dropdown-item" href="javascript:void();">Another action</a>
                                    <a class="dropdown-item" href="javascript:void();">Something else here</a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-item" href="javascript:void();">Separated link</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <canvas id="dash-chart-18" height="180"></canvas>
                    </div>
                    <ul class="list-group list-group-flush list shadow-none">
                        <li class="list-group-item d-flex justify-content-between align-items-center">Jeans <span class="badge gradient-knight text-white badge-pill shadow">25</span></li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">T-Shirts <span class="badge gradient-dusk
             text-white badge-pill shadow">25</span></li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">Shoes <span class="badge gradient-yoda text-white badge-pill shadow">25</span></li>
                    </ul>
                </div>
            </div>

            <!--End Dashboard Content-->

        </div>
        <!-- End container-fluid-->

    </div><!--End content-wrapper-->
<!--Start Back To Top Button-->
    <a href="javaScript:void();" class="back-to-top"><i class="fa fa-angle-double-up"></i> </a>
    <!--End Back To Top Button-->

    <!--Start footer-->
    <footer class="footer">
        <div class="container">
            <div class="text-center">
                Copyright © 2018 Fobia Admin
            </div>
        </div>
    </footer>
    <!--End footer-->

</div><!--End wrapper-->

<!-- Bootstrap core JavaScript-->
<asset:javascript src="fobia/js/jquery.min.js" />
<asset:javascript src="fobia/js/popper.min.js"/>
<asset:javascript src="fobia/js/bootstrap.min.js"/>

<!-- simplebar js -->
<asset:javascript src="fobia/plugins/simplebar/js/simplebar.js"/>
<!-- waves effect js -->
<asset:javascript src="fobia/js/waves.js"/>
<!-- sidebar-menu js -->
<asset:javascript src="fobia/js/sidebar-menu.js"/>
<!-- Custom scripts -->
<asset:javascript src="fobia/js/app-script.js"/>

<!-- Vector map JavaScript -->
<asset:javascript src="fobia/plugins/vectormap/jquery-jvectormap-2.0.2.min.js"/>
<asset:javascript src="fobia/plugins/vectormap/jquery-jvectormap-world-mill-en.js"/>
<!-- Sparkline JS -->
<asset:javascript src="fobia/plugins/sparkline-charts/jquery.sparkline.min.js"/>
<!-- Chart js -->
<asset:javascript src="fobia/plugins/Chart.js/Chart.min.js"/>
<!--notification js -->
<asset:javascript src="fobia/plugins/notifications/js/lobibox.min.js"/>
<asset:javascript src="fobia/plugins/notifications/js/notifications.min.js"/>
<!-- Knob Chart -->
<asset:javascript src="fobia/plugins/jquery-knob/excanvas.js"/>
<asset:javascript src="fobia/plugins/jquery-knob/jquery.knob.js"/>
<script>
    $(function() {
        $(".knob").knob();
    });
</script>
<!-- Index js -->
<asset:javascript src="fobia/js/index.js"/>

</body>
</html>
